<%-- 
    Document   : showwork
    Created on : Nov 11, 2010, 10:32:37 AM
    Author     : bertram
--%>

<%@page import="entities.Artwork"%>
<%@page import="data.DataProvider"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@ include file="banner.jsp" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<html>
    <head>
        <%try {
                        new data.Auth().checkAuth(request);
                    } catch (exceptions.AuthException aux) {
                        response.sendRedirect("login.html");
                    }%>
        <script type="text/javascript" src="jquery.js"></script>
        <script type="text/javascript" src="jquery.json-1.3.min.js"></script>
        <script type="text/javascript">
            var workID = <%=request.getParameter("vaerkID")%>;
            var data;
            var imgLink = "";
            var photos = [];

            $(document).ready(function() {
                $.ajax({
                    url: 'works/'+workID,
                    type: 'POST',
                    dataType: 'json',
                    timeout: 300000,
                    data: "data="+data,
                    error: function(text){
                        $("#messages").text("kunne ikke finde værket");
                    },
                    success: function(json){
                        drawPage(json);

                                
                    }
                });
                $('#frame').click(function() {
                    window.open(imgLink);
                });
                $('#thumbs').click(function(event) {
                    id = event.target.id;
                    showImages(id);
                });
                $("#similar").click(function(event){
                    id = event.target.id;
                    
                    getData(id);
                })
                $("#tags").click(function(event){
                    tag = event.target.toString().split("#")[1];
                    $.ajax({
                        url: 'works/tags/',
                        type: 'POST',
                        dataType: 'json',
                        timeout: 300000,
                        data: "tag="+tag,
                        error: function(text){
                            $("#messages").text("kunne ikke finde værket");
                        },
                        success: function(json){
                            $("#similar").text("");
                            $("#similar").append("andre værker tagget med "+json.tag+" <br /><table><tr>");
                            $.each(json.billeder, function(){
                                $("#similar").append("<td><img src='thumbs/"+ this.photos[0].imageID+".jpg' height='90' alt='"+this.title+"' id='"+this.id+"'/><br />"+this.title);
                            })
                        
                        }
                    })
                });


            });

            function getData(id){
                $.ajax({
                    url: 'works/'+id,
                    type: 'POST',
                    dataType: 'json',
                    timeout: 300000,
                    data: "data="+data,
                    error: function(text){
                        $("#messages").text("kunne ikke finde værket");
                    },
                    success: function(json){
                        drawPage(json);


                    }
                });
            }
            function drawPage(workData)
            {
                
                $.each(workData.photos, function(index, value){
                    photos[index] = this;
                });
                showImages(0);
                drawThumbs();
                insertData(workData);
            }
            function drawThumbs()
            {
                $("#thumbs").text("");
                $.each(photos, function(index, value){
                    if(this.type != "image/tiff")
                    {

                        $("#thumbs").append("<a href='#"+index+"'>"+
                            "<img src=thumbs/"+this.imageID+".jpg height='100' id='"+index+"' border='0'/>"+
                            "</a>&nbsp"
                    );}
                });
            }
            function showImages(pictureid)
            {   imgLink = "images/"+photos[pictureid].path;
                document.getElementById("frame").src="images/"+photos[pictureid].path;
                $("#picture-data").text("type: "+ photos[pictureid].type + " url: http://billeddeling/test/images/"+photos[pictureid].path+ " uploaded af: "+photos[pictureid].providedBy);
            }

            function insertData(info){
                var type;
                $.ajax({
                    url: 'kidtyper?typeid='+info.type,
                    type: 'POST',
                    dataType: 'text',
                    timeout: 300000,
                    data: "type="+info.type,
                    error: function(text){
                        $("#type").text(info.type);
                    },
                    success: function(text){
                        $("#type").text(text);


                    }
                });
                $("#titel").text(info.title);
                firstname = info.kunstnere[0].firstName;
                lastname = info.kunstnere[0].lastName
                $("#kunstner").text(firstname + " " + lastname);
                $("#aarstal").text(info.finished);
                $("#materialer").text(info.technique);
                $("#beskrivelse").text(info.description);
                $("#museum").text(info.owner);
                $("#tags").text("");
               
                $.each(info.tags, function(){
                    $("#tags").append("<a href='#"+this+"'>"+this+"</a>&nbsp");
                })
            }
        </script>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Billeddeling.dk: vis værk</title>
    </head>
    <body>
        <h1>værk information</h1>

        <table border="1">
            <thead>
                <tr>
                    <th></th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td><div id ="showpicture">

                            <img src="" height="500" alt="billede" id="frame"/>
                        </div><div id="picture-data">

                        </div></td>
                    <td> <table >
                            <tr><td>Titel : </td><td><div id="titel"/></td></tr>
                            <tr><td>Kunster : </td><td><div id="kunstner"/>
                            <tr><td>Årstal : </td><td><div id="aarstal"/></td></tr>
                            <tr><td>Museum : </td><td><div id="museum"/></td></tr>
                            <tr><td>Objekttype : </td><td><div id="type"/></td></tr>
                            <tr><td>Materialer/Teknik</td><td><div id="materialer"/></td></tr>
                            <tr><td>Proveniens : </td><td><div id ="proveniens"/></td></tr>
                            <tr><td>Beskrivelse : </td><td><div id="beskrivelse"/></td></tr>
                            <tr><td>Tags:</td><td> <div id="tags"/></td></tr>
                        </table></td>
                </tr>
                <tr>
                    <td><div id="thumbs">
                            Billeder knyttet til dette værk:<br />
                        </div></td>
                    <td>
                        <div id="similar">

                        </div>
                    </td>
                </tr>
                           </tbody>
        </table>
        <a href="imageinfo.jsp?vaerkID=<%=request.getParameter("vaerkID")%>" >ret billede</a>





    </body>
</html>
